<template>
  <div class="baidu-map q-pa-xs">
    <baidu-map
      class="bm-view"
      ak="3V3i3Kf3IZjUr111wjQ8vvyRiu1GY1jd"
      :center="center"
      :zoom="zoom"
      @ready="handler"
      :scroll-wheel-zoom="true"
      :double-click-zoom="true"
    >
      <bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
      <bm-marker
        v-for="user in userNormal"
        :key="user.userID"
        :position="{lat: user.gpsLatitude, lng:user.gpsLongtitude}"
        :dragging="false"
        :icon="{
            url: '../assets/normal_marker.png',
            size: { width: 50, height: 35 }
          }"
        @mouseover="show1(user)"
      >
        <bm-info-window
          :position="{lat: user.gpsLatitude, lng: user.gpsLongtitude}"
          :show="user.show"
          class="info-Window column"
        >
          <div>
            姓名：
            <strong v-html="user.userName"></strong>
          </div>
          <q-item class="bg-positive">一切正常</q-item>
        </bm-info-window>
      </bm-marker>

      <!-- <bm-marker
        v-for="user in userInGuide"
        :key="user.userID"
        :position="{lat: user.gpsLatitude, lng:user.gpsLongtitude}"
        :dragging="false"
        :icon="{
            url: '../assets/pre_marker.png',
            size: { width: 50, height: 35 }
          }"
        @mouseover="user.show = true"
      >
        <bm-info-window
          :position="{lat: user.gpsLatitude, lng: user.gpsLongtitude}"
          :show="user.show"
          @close="user.show = false"
          class="info-Window column"
        >
          <div>
            姓名：
            <strong v-html="user.userName"></strong>
          </div>
          <q-item class="bg-positive">处理中</q-item>
          <q-btn class="bg-negative" @click.native.stop="endGuide(user.userID)">处理完成</q-btn>
        </bm-info-window>
      </bm-marker>-->
      <!-- <bm-marker
        v-for="user in userInRequest"
        :key="user.userID"
        :position="{lat: user.gpsLatitude, lng:user.gpsLongtitude}"
        :dragging="false"
        :icon="{
            url: '../assets/alarm_marker.png',
            size: { width: 50, height: 35 }
          }"
        @mouseover="user.show = true"
      >
        <bm-info-window
          :position="{lat: user.gpsLatitude, lng: user.gpsLongtitude}"
          :show="user.show"
          @close="user.show = false"
          class="info-Window column"
        >
          <div>
            姓名：
            <strong v-html="user.userName"></strong>
          </div>
          <q-btn class="bg-positive" @click.native.stop="dealOrRefuse(true,user.userID)">处理</q-btn>
          <q-btn class="bg-negative" @click.native.stop="dealOrRefuse(false,user.userID)">拒绝</q-btn>
        </bm-info-window>
      </bm-marker>-->
    </baidu-map>
  </div>
</template>
